<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="s" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="jwr" uri="http://jawr.net/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="lw" tagdir="/WEB-INF/tags" %>

<head>
    <title>LookWider</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <jwr:style src="/css/reset.css"/>
    <jwr:style src="/bundles/metrostyle.css"/>
    <jwr:style src="/css/jscrollpane/jquery.jscrollpane.css"/>

    <jwr:script src="/bundles/jquery.js"/>
    <jwr:script src="/bundles/jscrollpane.js"/>
    <jwr:script src="/bundles/metrostyle.js"/>
    <jwr:script src="/js/tiledeploy.js"/>
</head>

<body class="modern-ui" style="zoom: 1;">
    <div class="topbar">
        <div class="nav-bar bg-color-lighten">

            <div class="nav-bar-inner padding10">
                <span class="pull-menu"></span>
                <a href="index.html">
                    <span class="element brand"><img src="<c:url value='/img/FrameElements/SecondTopBar/LOOKWIDERCOM.png'/>"/></span>
                </a>
                <div class="divider"></div>
                <ul class="menu">

                    <li>
                        <a href="settings.html" style="color: black;">Моя Страница</a>
                    </li>
                    <li>
                        <a href="messages.html" style="color: black;">Сообщения</a>
                    </li>
                    <li>
                        <a href="#" style="color: black;">Выйти</a>
                    </li>
                    <li style="color: black; margin-left: 350px;">
                        <!-- TODO insert chosen plugin (selectbox already has class)-->
                        <select data-placeholder="Житомир" style="width: 350px;" tabindex="5">
                            <option value=""></option>
                            <optgroup label="Украина">
                                <option>Житомир</option>
                                <option>Киев</option>
                                <option>Днепропетровс</option>
                                <option>Харьков</option>
                            </optgroup>
                            <optgroup label="Россия">
                                <option>Москва</option>
                                <option>Санкт-Петербург</option>
                                <option>Воронеж</option>
                                <option>Новосибирск</option>
                            </optgroup>
                        </select>

                    </li>
                    <li><a/></li>
                    <li class="divider"></li>
                    <li><a /></li>
                </ul>

            </div>
        </div>
    </div>

    <div class="clearfix"></div>

    <div class="sidebar">
        <div class="span3 bg-color-blue" style="line-height: 36px;"><a href="#">&nbsp; + Заведение</a></div>
        <div class="span3 bg-color-green" style="line-height: 36px;"><a href="#">&nbsp; + Резидент</a></div>
        <div class="span3 bg-color-purple" style="line-height: 36px;"><a href="#">&nbsp; + Квест</a></div>
    </div>

    <div class="contentframe">
        <div class="topbar bg-color-blueLight " style="padding-top:5px;" data-param-period="15000">
            <div class="input-control text span4" style="float: left; margin-left: 100px;">
                <input type="text" class="with-helper" />
                <button class="helper"></button>
            </div>
            <input type="submit" value="Искать"/>
            <div class="clearfix"></div>
        </div>

        <div class="pagecont">
            <lw:carouselSlide categories="${jobCategories}"/>

            <div class="clearfix"></div>

            <lw:userReviews/>

            <div class="clearfix"></div>

            <div class="more bg-color-blueLight" style="line-height: 30px;">
                <i class="icon-arrow-down-2" style="margin-left: 450px; font-size: 20px;"></i>
            </div>
        </div>

        <div class="pagecontopened">
            <div class="span13 bg-color-blue">
                <h2> Поесть Посидеть</h2>
            </div>

            <div class="page-control" data-role="page-control">
                <span class="menu-pull"></span>
                <div class="menu-pull-bar"></div>
                <ul>

                    <li class="active"><a href="#profs">Профессии</a></li>
                    <li><a href="#places">Категории Заведений</a></li>


                </ul>
                <div class="frames bg-color-blue" style="height: 700px;">
                    <div class="frame active" id="profs">
                        <div class="arrowbtnclose" style="float: left;vertical-align: top;"><a href="#"><i class="icon-arrow-left-3 fg-color-white" style="font-size: 45px;"></i></a></div>
                        <ul class="proflist" style="height: 550px;">
                            <li><a href="profpage.html">Официант</a></li>
                            <li><a href="profpage.html">Бармен</a></li>
                            <li><a href="profpage.html">Администратор</a></li>
                            <li><a href="profpage.html">Шеф-Повар</a></li>
                            <li><a href="profpage.html">Охранник</a></li>

                        </ul>
                        <div class="clearfix"></div>
                        <div class="arrowbtnclose" style="margin-top: 70px; float: right;"><a href="#"><i class="icon-arrow-up-left fg-color-white"></i></a> </div>
                    </div>

                    <div class="frame" id="places">

                        <div class="arrowbtnclose" style="float: left;"><a href="#"><i class="icon-arrow-left-3 fg-color-white" style="font-size: 45px;"></i></a></div>
                        <ul class="proflist" style="height: 550px;">
                            <li><a href="profpage.html">Рестораны</a></li>
                            <li><a href="profpage.html">Кафе</a></li>
                            <li><a href="profpage.html">Пабы</a></li>
                            <li><a href="profpage.html">Бары</a></li>
                            <li><a href="profpage.html">Пиццерии</a></li>

                        </ul>
                        <div class="clearfix"></div>
                        <div class="arrowbtnclose" style="margin-top: 70px;float: right;"><a href="#"><i class="icon-arrow-up-left fg-color-white"></i> </a> </div>

                    </div>

                </div>
            </div>
            <div class="clearfix"></div>
        </div>
    </div>

    <div class="topbar" style="text-align: right;">
        ©2012-2013 LOOKWIDER.COM
    </div>

</body>
